import React, { Component } from 'react';

import FormInput from '../../core/components/form.input';
import FormSelect from '../../core/components/form.select';
import { Get, Post } from '../../core/utils/fetch';
import Dialog from '../../core/utils/dialog';
import Header from '../../core/components/header';

const idMatch = /id=(\d+)/

class CarEdit extends Component {

    static contextTypes = {
        router: React.PropTypes.object.isRequired
    };

    id = ""

    constructor(props) {
        super(props);
        let m = idMatch.exec(props.location.search);
        if (m) {
            this.id = m[1];
        }
    }

    state = {
        carData: {},
    };

    componentDidMount = () => {
        this._refresh();
    };

    render() {
        let { carData } = this.state;
        // carData.carType = carData.carType || {};
        // carData.color = carData.color || {};
        // carData.location = carData.location || {};
        return (
            <div>
                <Header title="车辆编辑" subTitle="Cars Edit"></Header>
                <div className="row">
                    <div className="col-lg-4">
                        <h2>车辆编辑</h2>
                        <form role="form">
                            <FormInput className="has-success" label="车辆归属地" name="location" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="车牌号" name="carNo" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="品牌型号" name="carType" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="车身颜色" name="color" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="发动机号码" name="engineNo" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="车辆识别代号" name="carIdNo" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="IMEI" name="imei" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="车辆类型" name="vehicleType" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="使用性质" name="operateType" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="所属企业" name="comName" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="租赁司机" name="driverName" dataItem={carData}></FormInput>
                            <FormInput className="has-success" label="滴滴账号" name="didiCode" dataItem={carData}></FormInput>
                            <FormSelect className="has-success" label="租赁状态" name="carStatus" dataItem={carData} dataUrl="/api/enums/CarStatus" dataHandler={this._dataHandler}></FormSelect>
                        </form>

                        <div className="color-green">
                            带*为必填项
                        </div>
                        <button type="button" className="btn btn-sm btn-primary" onClick={this._save}>保存</button>
                    </div>
                </div>
            </div>
        );
    }

    _dataHandler = (r) => {
        for (var key in r) {
            return { name: r[key], value: key };
        }
    };

    _refresh = () => {
        if (this.id) {
            Get(`/spi/custInvest/car/${this.id}`)
                .then((carData) => {
                    carData.color = carData.color.value;
                    carData.carType = carData.carType.value;
                    carData.location = carData.location.value;
                    this.setState({ carData });
                });
        } else {
            this.setState({ carData: {} });
        }
    };

    _save = () => {
        let { carData } = this.state;
        Post('/spi/custInvest/carEdit', carData)
            .then((r) => {
                Dialog.alert(carData.id ? '更新成功' : '新增成功', () => {
                    this.context.router.history.goBack();
                });
            });
    };
}

export default CarEdit;